<template>
	<view>
		<view class="tableOutBox">
			<view class="tableInBox">
				<view class="tableTr">
					<view class="tableTd">项目</view>
					<view class="tableTd">总工</view>
					<view class="tableTd">总借支</view>
					<view class="tableTd">总未付</view>
				</view>
				
				<view class="tableTr" v-for="(item,index) in projectList" 
							:key="index">
					<view class="tableTd">{{item.name}}</view>
					<view class="tableTd color1">{{item.total_num}}<text v-if="item.id>0">{{item.work_type==1?'小时':'工'}}</text></view>
					<view class="tableTd">{{item.out_money}}</view>
					<view class="tableTd color2">{{item.no_money}}</view>
				</view>
			</view>
		</view>
		

		<!-- 下载excel -->
		<view class="downloadExcel" v-if="userId>0" @click="goPage('excelExport?type=2&role=1&user_id='+userId)">
			<image src="/static/img/excel.png" mode=""></image>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 类型
				subsectionList: [{
					name: '按工人'
				}, {
					name: '按工地'
				}],
				subsectionCurrent: 0,

				// 按工人
				memberList: [],
				memberTotal: {
					total_money:'',
					no_money:'',
					yes_money:'',
					num:'',
				},

				// 按工地
				projectList: [],
				userId:0,
				userInfo:{},
			}
		},
		onShow() {
			var _this = this;
			
			_this.getByProject();
		},
		methods: {
			// 选择类型
			subsectionChange(index) {
				this.subsectionCurrent = index;
			},

		

			// 按工地
			getByProject() {
				var _this = this;
				_this.$u.get('/api/project.monthdata/dataByProject', {
					role:1,
				}).then(res => {
					uni.hideLoading();
					console.log("==按工地==");
					console.log(res);
					_this.projectList = res.data;
					
					if(res.data.length>0){
						_this.userId= res.data[0].add_uid
					}
					
					_this.userInfo=res.count;
					
					
				}).catch(res => {
					console.log(res);
				})
			},

			// 页面跳转
			goPage(url) {
				uni.navigateTo({
					url: url
				})
			},
		}
	}
</script>

<style>

</style>
<style scoped lang="scss">
	// 工地信息
	.worksiteInfo_box {
		padding: 30rpx;
		border-radius: 30rpx;
		background-color:#fff;
		width: 690rpx;
		margin: 30rpx auto;
	}
	.workMemberName{
		border-bottom: 2rpx solid #e2e2e2;
		height: 60rpx;
		line-height: 40rpx;
		font-size: 32rpx;
	}
	
	.tableTitle{
		width: 100%;
		overflow: hidden;
	}
	.titleLi{
		width: 23%;
		float: left;
		text-align: center;
		
		height: 80rpx;
		line-height: 80rpx;
	}
	.titleLi i{
		display: inline-block;
		width: 16rpx;
		height: 16rpx;
		border-radius: 50%;
		background-color: #e2e2e2;
		margin-right: 10rpx;
	}
	.titleLi_1{
		width:31%;
	}
	.titleLi_1 i{
		background-color: $uni-color;
	}
	.titleLi_2 i{
		background-color: $uni-color-text;
	}
	.titleLi_3 i{
		background-color: $uni-color-text;
	}
	.titleLi_4 i{
		background-color: $uni-color-text;
	}
	// 下载excel
	.downloadExcel {
		position: fixed;
		right: 30rpx;
		bottom: 30rpx;
	}

	.downloadExcel image {
		width: 100rpx;
		height: 100rpx;
	}
	
	
	.excelIcon{
		background-color: #fff;
		border: 2rpx solid $uni-color-primary;
		padding: 10rpx 20rpx;
		border-radius: 10rpx;
		font-size: 24rpx;
	}
	
	//自定义表格
	.tableOutBox{
		background-color: #dae1e8;
		padding: 10rpx;
		box-sizing: border-box;
		width: 710rpx;
		margin: 20rpx auto;
		border-radius: 10rpx;
	}
	
	.tableInBox{
		background-color: #fff;
		border-radius: 10rpx;
	}
	.tableTr{
		height: 90rpx;
		line-height: 90rpx;
		overflow: hidden;
		background-color: #f7fbfe;
		border-bottom: 2rpx solid #e2e2e2;
	}
	.tableTr:nth-child(2n){
		background-color: #ffff;
	}
	.tableTd{
		width: 25%;
		text-align: center;
		padding-left: 10rpx;
		float: left;
		font-size: 26rpx;
		font-weight: bold;
		border-right: 2rpx solid #e2e2e2;
	}
	.color1{
		color: #ff6600;
	}
	.color2{
		color: #35c700;
	}
</style>
